<template>
    <div class="main">
        <Header  headername="终端销售单详情"></Header>
        <div class="detail">
            <table cellspacing='0'>
                <tr>
                    <th colspan="6">订单信息:</th>
                </tr>
                <tr>
                    <td>订单号:</td>
                    <td>ZDSS4635111</td>
                    <td>订单状态:</td>
                    <td>交易完成</td>
                    <td>下单时间:</td>
                    <td>2018-04-28</td>
                </tr>
                <tr>
                    <td>门店名称:</td>
                    <td>产品大神</td>
                    <td>商品金额:</td>
                    <td>155.02</td>
                    <td>商品数量:</td>
                    <td>16</td>
                </tr>
                <tr>
                    <td>终端编码:</td>
                    <td>001</td>
                    <td>优惠金额:</td>
                    <td>5.00</td>
                    <td>会员手机:</td>
                    <td>---</td>
                </tr>
                <tr>
                    <td>收银人员</td>
                    <td>syds</td>
                    <td>订单金额:</td>
                    <td>150.02</td>
                    <td>支付时间</td>
                    <td>2018-04-28</td>
                </tr>
            </table>
            <table cellspacing='0' class="mall">
                <tr>
                    <th colspan="7">商城信息:</th>
                </tr>
                <tr>
                    <td colspan="2">商品</td>
                    <td>常规销售价</td>
                    <td>用户购买价</td>
                    <td>数量</td>
                    <td>商品优惠</td>
                    <td>小计</td>
                </tr>
                <tr>
                    <td colspan="7">订单优惠:满30减3 【促销编码】</td>
                </tr>
                <tr>
                    <td>
                        <img src="" alt="">
                    </td>
                    <td>商品名称</td>
                    <td>￥10.00</td>
                    <td>￥5.00</td>
                    <td>X 3</td>
                    <td>商品优惠标签---优惠---优惠总额---【活动编码/改价授权账号】</td>
                    <td>￥15.00</td>
                </tr>
                <tr>
                    <td>
                        <img src="" alt="">
                    </td>
                    <td>商品名称</td>
                    <td>￥10.00</td>
                    <td>￥5.00</td>
                    <td>X 3</td>
                    <td>商品优惠标签---优惠---优惠总额---【活动编码/改价授权账号】</td>
                    <td>￥15.00</td>
                </tr>
                <tr>
                    <td colspan="7">订单优惠:满100享98折 【促销编码】</td>
                </tr>
                <tr>
                    <td>
                        <img src="" alt="">
                    </td>
                    <td>商品名称</td>
                    <td>￥10.00</td>
                    <td>￥5.00</td>
                    <td>X 3</td>
                    <td>商品优惠标签---优惠---优惠总额---【活动编码/改价授权账号】</td>
                    <td>￥15.00</td>
                </tr>
                <tr>
                    <td>
                        <img src="" alt="">
                    </td>
                    <td>商品名称</td>
                    <td>￥10.00</td>
                    <td>￥5.00</td>
                    <td>X 3</td>
                    <td>商品优惠标签---优惠---优惠总额---【活动编码/改价授权账号】</td>
                    <td>￥15.00</td>
                </tr>
                <tr>
                    <td colspan="7">订单优惠:无</td>
                </tr>
                <tr>
                    <td>
                        <img src="" alt="">
                    </td>
                    <td>商品名称</td>
                    <td>￥10.00</td>
                    <td>￥5.00</td>
                    <td>X 3</td>
                    <td>商品优惠标签---优惠---优惠总额---【活动编码/改价授权账号】</td>
                    <td>￥15.00</td>
                </tr>
                <tr>
                    <td>
                        <img src="" alt="">
                    </td>
                    <td>商品名称</td>
                    <td>￥10.00</td>
                    <td>￥5.00</td>
                    <td>X 3</td>
                    <td>商品优惠标签---优惠---优惠总额---【活动编码/改价授权账号】</td>
                    <td>￥15.00</td>
                </tr>
            </table>
            <table cellspacing='0' class="payment">
                <tr>
                    <th colspan="6">支付信息:</th>
                </tr>
                <tr>
                    <td>支付方式</td>
                    <td>支付金额</td>
                    <td>支付时间</td>
                    <td>支付状态</td>
                    <td>支付流水/会员卡号/凭证号</td>
                    <td>备注</td>
                </tr>
                <tr>
                    <td>抹零支付</td>
                    <td>0.02</td>
                    <td>2018-04-28</td>
                    <td>支付成功</td>
                    <td></td>
                    <td>0.02元抹零，无需支付</td>
                </tr>
                <tr>
                    <td>抹零支付</td>
                    <td>0.02</td>
                    <td>2018-04-28</td>
                    <td>支付成功</td>
                    <td></td>
                    <td>0.02元抹零，无需支付</td>
                </tr>
                <tr>
                    <td>抹零支付</td>
                    <td>0.02</td>
                    <td>2018-04-28</td>
                    <td>支付成功</td>
                    <td></td>
                    <td>0.02元抹零，无需支付</td>
                </tr>
                <tr>
                    <td>抹零支付</td>
                    <td>0.02</td>
                    <td>2018-04-28</td>
                    <td>支付成功</td>
                    <td></td>
                    <td>0.02元抹零，无需支付</td>
                </tr>
                <tr>
                    <td>抹零支付</td>
                    <td>0.02</td>
                    <td>2018-04-28</td>
                    <td>支付成功</td>
                    <td></td>
                    <td>0.02元抹零，无需支付</td>
                </tr>
                <tr>
                    <td>抹零支付</td>
                    <td>0.02</td>
                    <td>2018-04-28</td>
                    <td>支付成功</td>
                    <td></td>
                    <td>0.02元抹零，无需支付</td>
                </tr>
            </table>
            <div class="btn">
                <p @click="goHistory">返回</p>
            </div>
        </div>
    </div>
</template>

<script>
import Header from '@/components/goods/header'
export default {
    name:'TerminalSalesD',
    methods:{
        goHistory(){
            this.$router.go(-1)
        }
    },
    components:{
        Header
    }
}
</script>

<style scoped lang="scss">
.main{background-color: #f2f2f2;}
.detail{
    font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑';
    margin: 0 auto;
    border-width: 0px;
    width: 1100px;
    height: 1195px;
    background: inherit;
    background-color: rgba(255, 255, 255, 1);
    border: none;
    border-radius: 0px;
    box-shadow: none;
    overflow: hidden;
    margin-top: 10px;
    table{
        width: 1000px;
        margin: 0 auto;
        margin-top: 10px;
        tr{
            height: 40px;
            font-size: 12px;
            text-align: left;
            th{
                background-color: rgba(242, 242, 242, 1);
                box-sizing: border-box;
                border-width: 1px;
                border-style: solid;
                border-color: rgba(228, 228, 228, 1);
                border-bottom: 0px;
                font-weight: 700;
                padding-left: 10px;
            }
            td{
                box-sizing: border-box;
                border-width: 1px;
                border-style: solid;
                border-color: rgba(228, 228, 228, 1);
                color: #666666;
                padding-left: 10px;
            }
        }
    }
    .mall{
        tr{
            &:nth-of-type(2){
                font-weight: 700;
                td{
                    color: #000;
                }
            }
            &:nth-of-type(4),
            &:nth-of-type(5),
            &:nth-of-type(7),
            &:nth-of-type(8),
            &:nth-of-type(10),
            &:nth-of-type(11)
            {
                height: 60px;
            }
            &:nth-of-type(3),
            &:nth-of-type(6),
            &:nth-of-type(9)
            {
                td{
                    text-align: left;
                    padding-left: 10px;
                }
            }
            td{
                text-align: center;
                padding-left: 0;
                &:nth-of-type(1){
                    width: 85px;
                }
                &:nth-of-type(6){
                    width: 195px;
                }
                &:nth-of-type(2){
                    text-align: left;
                    padding-left: 10px;
                }
            }
        }
    }
    .payment{
        tr{
            &:nth-of-type(2){
                font-weight: 700;
                td{
                    color: #000;
                }
            }
            text-align: center;
            padding-left: 0;
            td{
                &:nth-of-type(5){
                    width: 160px;
                }
            }
        }
    }
    .btn{
        width: 1000px;
        margin: 0 auto;
        margin-top: 30px;
        text-align: left;
        p{
            width: 80px;
            text-align: center;
            line-height: 35px;
            box-sizing: border-box;
            border: 1px solid;
            border-color: rgba(228, 228, 228, 1);
            color:#666666;
            font-size: 14px;
            background-color: #fff;
            &:hover{
                color: rgb(0, 102, 255);
                border-color:rgb(0, 102, 255);;
            }
        }
    }
}

</style>